<template>
	<u-tabbar
		safeAreaInsetBottom
		:value="tabActive"
		@change="tabChange"
		:border="false"
		:fixed="false"
		customStyle="border-top-right-radius:20px;border-top-left-radius:20px;box-shadow: 0rpx -1rpx 7rpx 0rpx rgba(0,0,0,0.05);"
	>
		<template v-for="(item, index) in tabbarList">
			<u-tabbar-item v-if="$menuShow(item.menu)" :text="item.name" :name="index" :key="index" :icon="tabActive == index ? item.iconSelect : item.icon"></u-tabbar-item>
		</template>
	</u-tabbar>
</template>

<script>
export default {
	data() {
		return {
			userInfo: '',
			tabbarList: [
				{
					name: '待办',
					menu: '/home',
					icon: '/static/images/db.png',
					iconSelect: '/static/images/db-s.png',
					path: 'pages/index/index'
				},
				{
					name: '工作台',
					menu: '/home',
					icon: '/static/images/gzt.png',
					iconSelect: '/static/images/gzt-s.png',
					path: 'pages/workbenches/workbenches'
				},
				{
					name: '看板',
					menu: '/dataCenter',
					icon: '/static/images/kb.png',
					iconSelect: '/static/images/kb-s.png',
					path: 'pagesA/dataBoard/dataBoard'
				},
				{
					name: '我的',
					menu: '/home',
					icon: '/static/images/wd.png',
					iconSelect: '/static/images/wd-s.png',
					path: 'pages/user/user'
				}
			],
			tabActive: 0
		};
	},
	mounted() {
		this.userInfo = uni.getStorageSync('userInfo');
		var pages = getCurrentPages();
		var page = pages[pages.length - 1];
		let index = this.tabbarList.findIndex((item) => {
			return item.path == page.route;
		});
		this.tabActive = index;
	},
	methods: {
		tabChange(e) {
			console.log(e);
			if (!this.tabbarList[e].path) return;
			let userInfo = uni.getStorageSync('userInfo');
			if (userInfo.empower == 0 || !userInfo) {
				uni.navigateTo({
					url: '/pages/login/login'
				});
				return;
			}
			// 看板单独跳转方式
			if (this.tabbarList[e].path === 'pagesA/dataBoard/dataBoard') {
				uni.reLaunch({
					url: '/' + this.tabbarList[e].path
				});
				return;
			}
			uni.switchTab({
				url: '/' + this.tabbarList[e].path
			});
		}
	}
};
</script>

<style scoped lang="scss">
.icon {
	width: 36rpx;
	height: 36rpx;
}

.add-box {
	width: 70rpx;
	height: 70rpx;
	background: #3b75ff;
	box-shadow: 0rpx 5rpx 19rpx 0rpx rgba(38, 85, 197, 0.26);
	border-radius: 50%;
	color: #fff;
	font-size: 65rpx;
	line-height: 70rpx;
	text-align: center;

	.icon-tianjia {
		font-size: 32rpx;
		font-weight: bolder;
	}
}
</style>
